<template>
  <div>
    控制台
    <div class="qrcode" ref="qrCodeUrl"></div>
  </div>
</template>

<script>
  import QRCode from "qrcodejs2"

  export default {
    name: "ConsoleIndex",
    components: {},
    props: {},
    data() {
      return {}
    },
    methods: {
      creatQrCode() {
        let qrcode = new QRCode(this.$refs.qrCodeUrl, {
          text: "我爱你", // 需要转换为二维码的内容
          width: 100,
          height: 100,
          colorDark: "#000000",
          colorLight: "#ffffff",
          correctLevel: QRCode.CorrectLevel.H,
        })
      },
    },
    mounted() {
      this.creatQrCode()
    },
  }
</script>
<style lang="scss" scoped>
  .qrcode {
    display: inline-block;
    img {
      width: 132px;
      height: 132px;
      background-color: #fff; //设置白色背景色
      padding: 6px; // 利用padding的特性，挤出白边
      box-sizing: border-box;
    }
  }
</style>